{% extends 'base.html' %}

{% block content %}

<div class="container">

        <!-- Page-Title -->
        <div class="row">
            <div class="col-sm-12">
                <h4 class="page-title">SALT 管理</h4>
                <ol class="breadcrumb">
                    <li>
                        <a href="{% url 'SaltMasterList' %}">Minion 状态管理</a>
                    </li>
                    <li class="active">
                        SaltStack Minion Status 列表
                    </li>
                </ol>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-10">

                <div class="card-box">

                    <div class="row">
                        <div class="col-sm-12">
                            <h4 class="m-t-0 header-title"><b>Minion 列表</b></h4>
                            <div class="p-20">
                                <table class="table table-striped m-0">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>Minion</th>
                                            <th>saltmaster</th>
                                            <th>UP/Offline</th>
                                            <th>grains信息</th>
                                            <th>pillar信息</th>

                                        </tr>
                                    </thead>

                                    <tbody>
                                        {% for minion in SaltMinionData%}
                                        <tr>
                                            <th scope="row" data-id="{{minion.id}}">{{minion.id}}</th>
                                            <td>{{minion.minion}}</td>
                                            <td>{{minion.minion.saltserver}}</td>
                                            <td>{{minion.minion_status}}</td>
                                            <td><button class="btn btn-xs btn-info" data-toggle="modal" data-target=".bs-example-modal-lg" onclick="GetGrainsPillar({{minion.id}},'grains')" >view</button></td>
                                            <td><button class="btn btn-xs btn-info" data-toggle="modal" data-target=".bs-example-modal-lg" onclick="GetGrainsPillar({{minion.id}},'pillar')" >view</button></td>

                                        </tr>
                                        {% endfor%}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</div>


<div class="modal fade bs-example-modal-lg" id="grains" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" >Grains信息</h4>
            </div>

                <div class="modal-body">
                    <textarea style="OVERFLOW-Y: auto; color:#A6FFA6;  OVERFLOW-X:hidden;background-color: black;width:848px;height: 800px;" id='grains_data'>None</textarea>

                </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


<script src="/static/assets/js/json.js"></script>

<script>
    function GetGrainsPillar(id,action) {
        $('#grains').addClass('in').css('display','block');
        $.getJSON("{% url 'SaltMinionGrains' %}",{minion:id,action:action},function (result) {
            data=JSON.stringify(result);
            var grainsvar = document.getElementById('grains_data');
            grainsvar.value= formatJson(data,true);
        })
    }

</script>




{% endblock%}